<template>
	<div class="like">
		<div class="like-xin">
			<img src="http://img1.qunarzz.com/piao/fusion/1711/89/ebc329f16c55bb02.png">
			<p>猜你喜欢</p>
		</div>
		<ul class="ul-list" >
			<li class="like-li" v-for="item of likelist" :key="likelist.id">
				<div class="zuotu">
					<img :src="item.imgUrl">
				</div>
				<div class="rightwen">
					<div class="righttitle">{{item.title}}</div>
					<div class="fenshu">
						<!-- <span class="iconfont">&#xe71c;</span> -->
						<!-- <span class="pinglun">808条评论</span> -->
					</div>
					<div class="qian">
						<span class="price">￥<em class="shuzi">{{item.price}}</em></span>起
						<span class="diqu">{{item.adress}}</span>
					</div>
					<div class="jieshao">
						<div class="jianjie">贯通华清池温泉水脉，终年43℃水温</div>
					</div>
				</div>
			</li>
		</ul>
		<div class="gengduo">查看所有产品</div>
	</div>	
</template>

<script type="text/javascript">
	export default{
			props:["likelist"],
		data(){
			return{
			
			}
		}
	}
</script>

<style scoped>
	.like-xin img{
		float:left;
		width:.3rem;
		height:.3rem;
		padding-left:.1rem;
	}
	.like-xin p{
		font-size:.24rem;
		margin-left:.5rem;
		display: block;
	}
	.zuotu{
		float: left;
	    overflow: hidden;
	    width: 2rem;
	    height: 2rem;
	    background: #f0f5f8;
	}
	.ul-list{
		margin-left: .24rem;
		margin-top:.25rem;
	}
	.like-li{
		margin-bottom:30px;
		border-bottom:1px solid #999;
	}
	.rightwen{
		overflow: hidden;
    	padding-left: .22rem;
	}
	.righttitle{
		margin-top: .26rem;
	    height: .44rem;
	    color: #212121;
	    font-size: .32rem;
	    line-height: .44rem;
	    overflow: hidden;
	    width: 100%;
	    white-space: nowrap;
	    text-overflow: ellipsis;
	}
	.fenshu{
		margin-top: .14rem;
    	height: .34rem;
	}
	/*.pinglun{
		color: #616161;
	    font-size: .24rem;
	    line-height: .34rem;
	    vertical-align: text-bottom;
	}*/
	.qian{
		position: relative;
	    margin-top: .22rem;
	    color: #616161;
	    font-size: .24rem;
	    line-height: .4rem;
	    color: #ff8300;
	}
	.price{
		color: #ff8300;
	}
	.shuzi{
		font-size: .4rem;
	}
	.diqu{
		position: absolute;
	    right: .24rem;
	    bottom: 0;
	    color: #616161;
	}
	.jieshao{
		display: inline-block;
	    margin-top: .48rem;
	    margin-right: .24rem;
	    background: #fff9f9;
	    padding: .04rem .1rem;
	    color: #f55;
	    font-size: .24rem;
	    line-height: .34rem;
	}
	.jianjie{
		display: -webkit-box;
	    overflow: hidden;
	    text-overflow: ellipsis;
	    -webkit-line-clamp: 2;
	    -webkit-box-orient: vertical;
	}
	.gengduo{
		color: #00afc7;
	    font-size: .28rem;
	    text-align: center;
	}
</style>